<div class="card-body">
<div class="card-btns mb-2-5">
  <button class="btn btn-info" type="button" data-id="0" data-bs-toggle="modal" data-bs-target="#modal-record" onclick="editRecord(this)"><i class="mdi mdi-content-save"></i> 添加收支</button>
</div>
<div class="table-responsive">
  <table class="table table-bordered">
    <thead>
      <tr>
        <th>费用类型</th>
        <th>金额(元)</th>
        <th>方式</th>
        <th>收(退)费人</th>
        <th>收支时间</th>
        <th>备注</th>
        <th>操作</th>
      </tr>
    </thead>
    <tbody id="payment_record_tbody">
        <?php foreach ($payment_records as $k => $vo): ?>
          <tr id="record_tr_{:$vo['id']}">
            <td>{:$PaymentRecordModel->getChargeTypeCn($vo['charge_type'])}({:$vo['charge_type2']})</td>
            <td>{:$vo['amount']}</td>
            <td>{:$PaymentRecordModel->getGetTypeCn($vo['get_type'])}</td>
            <td>{:$vo['admin']['truename']}</td>
            <td>{:$vo['collection_time']}</td>
            <td>{:$vo['remark']}</td>
            <td>
              <div class="btn-group btn-group-sm">
                <a class="btn btn-default" href="javascript:void(0)" data-id="{:$vo['id']}" onclick="editRecord(this)" data-bs-toggle="modal" data-bs-target="#modal-record" title="编辑"><i class="mdi mdi-pencil"></i></a>
                <a class="btn btn-default" href="javascript:void(0)" data-id="{:$vo['id']}" onclick="deleteRecord(this)" title="删除"><i class="mdi mdi-delete"></i></a>
              </div>
            </td>
          </tr>
        <?php endforeach ?>
    </tbody>
  </table>
</div>
</div>

<script type="text/javascript">
  $("#charge_type").on('change',function(){
    if ($(this).val() == 0) {
      var childs = eval('{:json_encode($PaymentRecordModel->getChargeTypeChild0())}');  
      $("#record_content_row").show();
    }else{
      var childs = eval('{:json_encode($PaymentRecordModel->getChargeTypeChild1())}');
      $("#record_content_row").hide();
    }
    var str = '';
    for (var i in childs){
      str += '<option value="'+childs[i]+'">'+childs[i]+'</option>';
    }
    $("#charge_type2").html(str);
  });

  // 委估对象 - 查勘
  function editRecord(btn){
    var data_id = $(btn).attr('data-id');
    if (data_id == null) { data_id = 0; }
    $('input[name="record_id"]').val(data_id);

    $.ajax({
        url:'{:url("PaymentRecord/detail")}',
        data:{id:data_id,order_id:'{:$order['id']}'},
        type:'post',
        dataType:'json',
        success:function(data){
          var data = data.data;
          var fields = ['charge_type','charge_type2','amount','get_type','payer','admin_id','collection_account','collection_bank','collection_name','collection_time','remark','invoice_total'];
          for(var i in fields){
            var field = fields[i];
            $("#record_content").find("#"+field).val(data[field]);
            // 如果是费用类型字段，触发下onchange事件
            if (field == 'charge_type') {
              $("#charge_type").trigger('change');
            }
          }
        }
    });
  }

  $(".submit_record_btn").on('click',function(){
    var params = $("#record_content").serialize();
    $.ajax({
        url:'{:url("PaymentRecord/save")}',
        data:params,
        type:'post',
        dataType:'json',
        success:function(data){
          if (data.code == '2000') {
            var data = data.data;
            var str = '<tr id="record_tr_'+data.id+'">'+
              '<td>'+data.charge_type_cn+'('+data.charge_type2+')</td>'+
              '<td>'+data.amount+'</td>'+
              '<td>'+data.get_type_cn+'</td>'+
              '<td>'+data.admin_name+'</td>'+
              '<td>'+data.collection_time+'</td>'+
              '<td>'+data.remark+'</td>'+
              '<td><div class="btn-group btn-group-sm">'+
              '<a class="btn btn-default" href="javascript:void(0)" data-id="'+data.id+'" onclick="editRecord(this)" data-bs-toggle="modal" data-bs-target="#modal-record" title="编辑"><i class="mdi mdi-pencil"></i></a>'+
              '<a class="btn btn-default" href="javascript:void(0)" data-id="'+data.id+'" onclick="deleteRecord(this)" title="删除"><i class="mdi mdi-delete"></i></a>'+
              '</div></td>'+
            '</tr>';
            // 如果有ID就覆盖，没有就新增
            if ($('input[name="record_id"]').val() > 0) {
              $("#record_tr_"+data.id).replaceWith(str);
            }else{
              $("#payment_record_tbody").append(str);
            }
          }else{
            cchUtil.message(data.msg,'danger');
          }
        }
    });
  });

  function deleteRecord(obj){
    var data_id = $(obj).attr('data-id');
    $.ajax({
        url:'{:url("PaymentRecord/delete")}',
        data:{id:data_id},
        type:'post',
        dataType:'json',
        success:function(data){
          if (data.code == '1') {
            $(obj).parent().parent().parent().remove();
          }else{
            cchUtil.message(data.msg,'danger');
          }
        }
    });
  }
</script>